<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">

<head th:replace="/common/include :: header(~{::title}, ~{::link}, ~{::style})">
    <title>DEMO-弹窗-表格弹层</title>
</head>
<body class="gray-bg">
<div class="wrapper wrapper-content fadeInRight">
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox">
                <div class="ibox-title">
                    <h5>弹层框</h5>
                </div>
                <div class="ibox-content">
                    <p>弹出复选框表格及单选框表格（点击提交后得到数据）。 </p>
                    <button type="button" class="btn btn-primary" onclick="selectCheckUser()">弹出表格（复选框）</button>
                    <button type="button" class="btn btn-success" onclick="selectRadioUser()">弹出表格（单选框）</button>
                </div>
            </div>
        </div>
    </div>
</div>

<div th:replace="/common/include :: footer"></div>

<script type="text/javascript">
    var prefix = ctx + 'api/demo/modal/table';

    function selectCheckUser() {
        $.operate.edit({
            title: '选择用户',
            content: prefix + '/check',
            height: 600,
            shadeClose: true,
            _index: window.name,
            _callback: 'selectUsers'
        });
    }

    function selectRadioUser() {
        $.operate.edit({
            title: '选择用户',
            content: prefix + '/radio',
            height: 600,
            shadeClose: true,
            _index: window.name,
            _callback: 'selectUsers'
        });
    }

    function selectUsers(selected) {
        $.modal.lay.alertSuccess(selected, '已选用户');
    }
</script>
</body>
</html>
